<template>
	
	<view class="cat_details_page" :style="{backgroundImage:'url('+ detailsObj.photo + ')'}">

		<scroll-view :scroll-top="scrollTop" scroll-y="true" class="cat_details_page_scroll" @scrolltoupper="upper"
			@scrolltolower="lower" @scroll="scroll" >
			<view class="details_content">
				<!-- <image :src="detailsObj.photo" mode="aspectFill"></image> -->
				<div class="cat_fill"></div>
				<p :style="{color: detailsObj?.color}">{{detailsObj.name}}</p>
				<div class="cat_desc">
					{{detailsObj.desc}}
				</div>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title:'详情',
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				detailsObj:{},
				detailsData:[
						{
							id:1,
							name:'三花猫',
							photo:'../../static/cat/kunvshi.png',
							desc:'三花猫是一种身披黑色、橘色和白色三种颜色的猫，正式命名为“玳瑁白色猫”。这种颜色组合是由基因决定的，通常只出现在母猫身上。虽然也有少数公猫拥有这种三色，但一般这样的公猫会有生殖缺陷。三花猫性格活泼可爱，温和可亲，好动爱玩，体质好，好养活，情商高，爱干净。但需要注意的是，三花猫一般都是母猫，长相天差地别，基因不稳定。',
						},
						{
							id:2,
							name:'美国短毛猫',
							color:'#434245e6',
							photo:'../../static/cat/meiguoduanmao.png',
							desc:'美国短毛猫，简称美短，是一种原产于美国的猫种，属于大型猫。这种猫的体格强壮，与英国短毛猫相比，其脸形和嘴稍长，条纹色较多。美短的性格温顺、活泼好动，不喜欢叫，比较粘人，适应能力强，不挑食，脾气好比较聪明。但需要注意的是，美短有可能有先天性遗传病，运动量过大。常见的有两种：银虎斑与虎斑加白。',
						},
						{
							id:3,
							name:'英国短毛猫',
							color:'#434245e6',
							photo:'../../static/cat/yingguoduanmao.png',
							desc:'英国短毛猫，简称英短，是一种历史悠久的猫品种。其体形圆胖，四肢粗短发达，毛短而密，头大脸圆，温柔平静，对人友善，极易饲养。大而圆的眼睛根据被毛不同而呈现各种颜色。经过多年的繁殖控制，英国短毛猫成为了聪明、健康、强壮和精于捕猎的优良品种。性格温顺、活泼不好动、不会乱叫。常见的有蓝猫、蓝白、金渐层、银渐层四种，价格因品种和品质而异。',
						},
						{
							id:4,
							name:'布偶猫',
							photo:'../../static/cat/buou.png',
							desc:'布偶猫是一种颜值极高的猫种，拥有软绵绵的体型和甜美的叫声，被人们誉为“仙女猫”。这种猫原产于美国，体型和体重在猫中都是最大的，祖先为白色长毛猫与伯曼猫。尽管外表看似高冷，但实际上非常粘主人，会迎接主人回家，对主人和陌生人都十分友善，特别适合家中有小宝宝的家庭。然而，布偶猫的毛发需要经常打理，且肠胃较为敏感。市场价格较高，便宜的都在5000以上，贵的甚至达到两三万',
						},
						{
							id:5,
							name:'暹罗猫',
							photo:'../../static/cat/xianluo.png',
							color:'#434245bd',
							desc:'暹罗猫，英文名为Siamese，是泰国著名的短毛猫品种。这种猫原产于泰国，200多年前曾是泰国的贵族猫，仅在土宫和大寺院中饲养。暹罗猫性格合群、友好、忠诚、胆大，并且好奇心强、活泼好动、精力旺盛。其外形独特，脸和四肢都是黑色，给人一种异国风情的感觉。长毛暹罗猫则是其变种，又称巴厘猫或爪哇猫，性格与短毛暹罗猫相似，喜欢与人玩耍和撒娇。',
						},
						{
							id:6,
							name:'狸花猫',
							photo:'../../static/cat/lihua.png',
							desc:'狸花猫是一种具有数千年历史和高度适应性的猫种，起源于中国，并在宋朝就有记录。这种猫非常聪明和独立，不需要主人过多的照顾，甚至能自己找到食物。尽管它们活泼好动，但并不特别粘人，更倾向于保持一定的独立性和距离。它们的身体健壮，不容易生病，因此非常适合那些希望拥有一个不需要过多照顾的宠物的人。总体来说，狸花猫是一种集智慧、独立和忠诚于一身的优秀猫种。',
						},
						{
							id:7,
							name:'苏格兰折耳猫',
							photo:'../../static/cat/sugelanzheer.png',
							desc:'苏格兰折耳猫是一种原产于苏格兰的猫种，其独特之处在于其折耳基因，这是由于不完整的显性基因突变造成的。这种猫躯体粗壮，被毛密厚，头大脸圆，双耳下盖贴紧额头，尾粗大，模样十分可爱。它们的性格温和平静，聪明善解人意，非常适合家庭饲养。此外，苏格兰折耳猫还具有肠胃较弱的特点，因此喂食猫粮时最好选择固定品牌。',
						},
						{
							id:8,
							name:'波斯猫',
							photo:'../../static/cat/bosi.png',
							color:'#2e2d30db',
							desc:'波斯猫是一种长毛猫，以其华丽的背毛和优雅的举止而著称，被誉为“猫中王子”和“王妃”。这种猫性情温文尔雅，聪明敏捷，善解人意，少动好静，叫声尖细柔美，爱撒娇，举止风度翩翩。波斯猫天生一副娇生惯养之态，给人一种华丽高贵的感觉。其颜值高、环境适应能力强、不会到处搞破坏、比较安静、脾气好，但易掉毛，需要经常护理，对温度要求高。价格大多在1000-15000元。',
						},
						{
							id:9,
							name:'狮子猫',
							photo:'../../static/cat/shizi.png',
							desc:'狮子猫，也被称为白猫或波斯猫，因其大多数为白色的毛发而得名。这种猫不仅全身披着厚厚的雪白长毛，有的还拥有独特的黄蓝鸳鸯眼。狮子猫的耐寒性强，身体健壮，抗病力出色，并且擅长捕鼠。其性格温和、喜欢安静。狮子猫起源于山东临清，是波斯猫与鲁西狸猫杂交的后代。因其出众的颜值和波斯猫的血统，许多人更倾向于称其为波斯猫。这种猫在过去曾是皇室的宠物，而其价格因品质和特点而异，一般在3000到10000元之间。',
						},
						{
							id:10,
							name:'俄罗斯蓝猫',
							photo:'../../static/cat/eluosilanmao.png',
							desc:'俄罗斯蓝猫是一种体型苗条、耳朵直立、性格文静和害羞的猫种。这种猫拥有银蓝色的短被毛，走路时似乎用脚尖在走，展现出一种猫中的贵族风度。它们天生一副笑容可掬的面容，喜欢安静的环境，对主人非常信任，并能与家中其他宠物和平共处。俄罗斯蓝猫在美国和日本特别受欢迎，它们聪明、学习能力很强，并且几乎不掉毛，是一种容易饲养的家庭宠物。',
						},
						{
							id:11,
							name:'阿比西尼亚猫',
							photo:'../../static/cat/abixiniya.png',
							desc:'阿比西尼亚猫是一种历史悠久、外貌和性格独特的家猫品种。这种猫的体态修长，毛色光滑闪亮，颜色浓淡相间，眼圆大有神，行走轻盈且略带点野性。它是最古老的家猫品种之一，传说中是古埃及神猫的后代。性格上，阿比西尼亚猫热情可爱、活泼好动，善于跳跃，喜欢晒太阳和玩水。它还因其步态优美被誉为“芭蕾舞猫”，毛发与野兔相似，因此也有“兔猫”或“球猫”的别称。这种猫非常适合家养，特别是陪伴老人，对人忠诚、不离不弃。',
						},
						{
							id:12,
							name:'缅因猫',
							photo:'../../static/cat/mianyin.png',
							desc:'缅因猫是一种原产于美国缅因州的猫种，体型健硕，毛色多样，性格倔强且勇敢。这种猫在乡村经过驯养，约在18世纪中叶形成了稳定的品种。缅因猫的体型在猫类中属于较大的，毛色则有60余种不同的被毛图案。它们喜欢独处，但与人相处融洽，并且不怕寒冷，抗病力强。尽管它们对人类友爱，但并不特别粘人，更像是一个平等的伙伴。缅因猫的价格因品质和稀有度而异，大约在5000到50000元之间。',
						},
						{
							id:13,
							name:'孟加拉猫',
							photo:'../../static/cat/mengjiala.png',
							desc:'孟加拉猫是食肉目猫科猫属哺乳动物。 [3]大型猫，精悍。容貌轮廓鲜明；长鼻，鼻孔向侧面散开而突出；有双重颚；体长而厚实；大骨骼，肌肉发达；被毛有光泽，触感独特。毛色多样化，如亮橙色的豹斑，深红褐色的水貂色等；眼睛色为黄色，绿色。',
						},
				]
			}
		},
		methods: {
			
			scroll: function(e) {
				console.log(e)
				this.old.scrollTop = e.detail.scrollTop
			},
			upper: function(e) {
				console.log(e)
			},
			lower: function(e) {
				console.log(e)
			},
			initData:function(_id){
				this.detailsObj = this.detailsData.filter(item => item.id == _id)?.[0]
				console.log(this.detailsObj)
			}
		},
		onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
			console.log(option.id); //打印出上个页面传递的参数。
			this.initData(option.id)
		}

	}
</script>

<style>

	uni-page-body,.cat_details_page{
		height: 100%;
		background-color: #F4F3F6;
		width: 100%;
	}
	.cat_details_page{
		background-repeat: repeat-y;
		background-position: top;
		background-size: contain;
	}
	.cat_details_page::before{
		filter: blur(5px);
		z-index: -1;	
		position: absolute;
		backdrop-filter: blur(30px);
	}
	.cat_details_page .cat_details_page_scroll{
		height: 100%;
	}
	.cat_details_page_scroll::before{
		background-image:  var(--bgurl);
	}
		
	.details_content{
		height: auto;
		margin: 40rpx;
		text-align: center;
	}
	.details_content .cat_fill{
		width: 100%;
		height: 400rpx;
	}
	.details_content p{
		margin-top: 10rpx;
		font-size: 56rpx;
		text-align: left;
		padding-left: 20rpx;
		color: #F4F3F6;
/* 		background-color: #ffffffc7;
		width: auto;
		float: left;
		border-radius: 30rpx; */
	}
	.details_content .cat_desc{
		float: left;
		margin-top: 20rpx;
		font-size: 32rpx;
		text-indent: 64rpx;
		text-align: left;
		background-color: #ffffffc7;
		border-radius: 30rpx;
		padding: 30rpx;
		opacity: 0.7;
	}
</style>